<template>
	<view class="container">
		<view class="layout">
			<view class="list">
				<view class="list-box">
					<view class="body bjt">
						<view class="tipMsg" v-if="state.obj.status == 1">平台已收到售后申请，等待平台处理</view>
						<view class="tipMsg" v-else-if="state.obj.status == 2">平台已同意售后申请，等待寄回商品</view>
						<view class="tipMsg" v-else-if="state.obj.status == 3">平台已同意退货退款申请，并已完成 退款</view>
						<view class="tipMsg" v-else-if="state.obj.status == 4">平台已同意售后申请，等待寄回商品</view>
						<view class="tipMsg" v-else-if="state.obj.status == 5">平台已收到寄回商品，并回寄新的商品</view>
						<view class="tipMsg" v-else-if="state.obj.status == 6">平台拒绝退订申请</view>
						<view class="errMsg" v-if="state.obj.status == 6">拒绝理由：{{ state.obj?.refuse_reason }}</view>
						<view class="btn-group">
							<view class="btn-default" @click="revoke">撤销售后申请</view>
						</view>
					</view>
					<view class="divider"></view>
					<view class="block-item" style="margin-bottom: 0">
						<view class="flexjus">
							<view class="h4">寄回地址</view>
							<view class="copy" @click="copy">复制</view>
						</view>
						<view class="userInfo">{{ state.obj?.platform_info?.platform_name }} {{ state.obj?.platform_info?.platform_jh_phone }}</view>
						<view class="address">{{ state.obj?.platform_info?.platform_address }}</view>
						<view class="errMsg">请勿在寄回时到付货品，否则平台将有权拒收。</view>
					</view>
					<view class="divider"></view>
					<view class="list-box">
						<view class="flexjus" style="padding: 20rpx 32rpx 0">
							<view class="h4">售后信息</view>
						</view>
						<view class="info">
							<image :src="state.obj?.goods?.goods_thumb" class="pic"></image>
							<view class="msg">
								<view class="title">{{ state.obj?.goods?.goods_title }}</view>
								<view class="content">{{ state.obj?.goods?.goods_sku_name }}</view>
								<view class="flexjus">
									<view class="time">{{ state.obj?.order?.created_at }}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="divider"></view>
					<view class="body">
						<view class="msg">
							<view class="label">订单编号</view>
							<view class="text">{{ state.obj?.order?.order_sn }}</view>
						</view>
						<view class="msg">
							<view class="label">下单时间</view>
							<view class="text">{{ state.obj?.order?.created_at }}</view>
						</view>
						<view class="msg">
							<view class="label">售后原因</view>
							<view class="text">{{ state.obj.reason }}</view>
						</view>
						<view class="msg">
							<view class="label">补充描述或凭证</view>
							<view class="text">{{ state.obj?.aftersale_desc }}</view>
						</view>
						<view class="piclist">
							<image class="pic" v-for="(item, index) in state.obj?.aftersale_images" :key="index" :src="item"></image>
						</view>
						<block v-if="state.obj?.type == 1 && state.obj?.kuaidi_id">
							<view class="msg">
								<view class="label">寄回快递公司</view>
								<view class="text">{{ state.obj?.kuaidi?.name }}</view>
							</view>
							<view class="msg">
								<view class="label">寄回单号</view>
								<view class="text">{{ state.obj?.refund_logistics_number }}</view>
							</view>
						</block>
						<block v-if="state.obj?.type == 2 && state.obj?.kuaidi_id">
							<view class="msg">
								<view class="label">换货快递公司</view>
								<view class="text">{{ state.obj?.kuaidi?.name }}</view>
							</view>
							<view class="msg">
								<view class="label">换货单号</view>
								<view class="text">{{ state.obj?.refund_logistics_number }}</view>
							</view>
						</block>
					</view>
				</view>
			</view>
			<view class="btn-group">
				<view class="btn-submit" @click="gotoPage" v-if="state.obj?.status == 2">填写寄回快递信息</view>
				<view class="btn-disable" v-if="state.obj?.kuaidi_id">填写寄回快递信息</view>
			</view>
			<view class="footer" v-if="state.obj.status == 5">
				<view class="btn-group-right">
					<view class="btn">查看物流</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
import { reactive } from 'vue';
import { formPost, post } from '@/request/index.js';
import FormData from '@/request/formData.js';
import { onLoad } from '@dcloudio/uni-app';

const state = reactive({
	id: '',
	obj: {}
});
onLoad(async (option) => {
	state.id = option.id;
	await getListData();
	await getDetail();
});

// 获取售后原因
const getListData = async () => {
	const res = await post('mm/aftersaleReason');
	const { code, data } = res;
	if (code == 200) {
		state.range = data.map((item) => {
			return {
				id: item.id,
				text: item.aftersale_reason
			};
		});
	}
};

const getDetail = async () => {
	let formDatas = new FormData();
	formDatas.append('order_id', state.id);
	const params = formDatas.getData();
	const res = await formPost('mm/getAftersaleInfo', params);
	const { code, data } = res;
	if (code == 200) {
		state.obj = data;
	}
};

//售后原因由id转为文字
const reason_text = () => {};

//撤销售后
const revoke = async () => {
	const res = await post('agent/order/revoke_after', { order_id: state.id });
	const { code, message } = res;
	if (code == 200) {
		uni.showToast({
			title: message
		});
	}
};

//填写寄回快递信息
const gotoPage = () => {
	uni.navigateTo({
		url: `pages/kuaidiInfo/kuaidiInfo?id=${state.id}`
	});
};

//复制寄回地址
const copy = () => {
	uni.setClipboardData({
		data: `${state.obj?.platform_info?.platform_name} ${state.obj?.platform_info?.platform_jh_phone} ${state.obj?.platform_info?.platform_address}`
	});
};
</script>

<style scoped lang="scss">
.layout {
	padding-top: 40rpx;
	.body {
		background-color: transparent;
		.tipMsg {
			padding-bottom: 10rpx;
		}
	}
}
</style>
